<template>
  <div class="app-container">
    <div class="info-title">
      <span>排查任务信息</span>
      <router-link to="/workbench/check/index" class="info-back">
        <el-button type="primary">返回列表</el-button>
      </router-link>
    </div>
    <el-row class="demo-radius" v-for="(item, index) in myCheckTaskInfo" :key="index">
      <el-col :span="10" class="check-info-left">
        <span>管控措施类型：{{ item.classifyName }}</span>
        <span>管控措施内容：{{ item.riskMeasureDesc }}</span>
        <span>隐患排查内容：{{ item.troubleshootContent }}</span>
      </el-col>
      <el-col :span="14" class="check-info-left">
        <span>隐患排查情况：{{ item.checkDesc }}</span>
        <span
          >隐患排查结果：{{ item.checkStatus == "1" ? "有隐患" : "无隐患" }}
        </span>
      </el-col>
    </el-row>
  </div>
</template>
<script setup name="MyCheckInfo">
import { getMyWaitCheckTask, submitCheckTask } from "@/api/prevent/workbench/myCheck";
const myCheckTaskInfo = ref([]); //检查任务信息
const loading = ref(false);
const { proxy } = getCurrentInstance();
const route = useRoute();
const router = useRouter();
const data = reactive({
  form: [],
});
const { form } = toRefs(data);

(() => {
  const taskId = route.params && route.params.taskId;
  if (taskId) {
    loading.value = true;
    getMyWaitCheckTask(taskId).then((response) => {
      myCheckTaskInfo.value = response.data;
      loading.value = false;
      initForm();
    });
  }
})();
/** 初始化form表单 */
function initForm() {
  form.value = [];
  myCheckTaskInfo.value.forEach((item) => {
    form.value.push({
      taskId: item.taskId,
      taskContentId: item.taskContentId,
      checkStatus: "0",
      checkDesc: "",
    });
  });
}

/** 校验数据 */
function validateData() {
  let res = true;
  form.value.forEach((item, index) => {
    if (form.value[index].checkDesc == "" || form.value[index].checkDesc == undefined) {
      proxy.$modal.msgError("请输入第" + (index + 1) + "项的排查情况");
      res = false;
    }
  });
  return res;
}

/**提交排查任务 */
function submitForm() {
  //   console.log(form.value);
  //   return;
  if (validateData()) {
    submitCheckTask(form.value).then((response) => {
      proxy.$modal.msgSuccess("提交成功");
      router.push("/workbench/check/index");
    });
  }
}

/** 初始化 */
</script>
<style scoped lang="scss">
.info-title {
  height: 48px;
  width: 100%;
  padding: 0 18px;
  border-radius: 5px;
  background-color: #f6f8fa;
  color: #2c2c2c;
  margin: -6px 0 15px 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  & .info-back {
    color: #0086ff;
  }
  & span {
    font-weight: 800;
  }
}
.demo-radius {
  width: 90%;
  border: 1px solid var(--el-border-color);
  border-radius: 5px;
  margin: 10px;
  padding: 10px;
}
.check-info-left {
  display: flex;
  flex-direction: column;
  height: 120px;
  & span {
    height: 40px;
    line-height: 40px;
    color: #9e9e9e;
    font-size: 12px;
  }
}
.check-footer {
  margin-top: 40px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
</style>
